<template>
  <!-- 加粗子公司下拉选框 -->
  <div id="SubsidiarySelect">
    <el-select v-model="subId" @change="handleSelectChange">
      <el-option v-for="item in companyList" :key="item.subid" :label="item.subName" :value="item.subid">
      </el-option>
    </el-select>
  </div>
</template>
<script>
import { getCompanyList } from "@/util/xc/utils.js";
import { mapState } from "vuex";
export default {
  name: 'SubsidiarySelect',
  data() {
    return {
      subId: '',
    };
  },
  computed: {
    ...mapState({
      companyList: state => state.reward.companyList,
    }),
  },
  methods: {
    handleSelectChange(data) {
      this.$emit('change', data);
    },
  },
  mounted() {
    getCompanyList().then(() => {
      // console.log(this.companyList);
      this.subId = this.companyList?.length ? this.companyList[0].subid : '';
      this.handleSelectChange(this.subId);
    });
  }
};
</script>
<style lang="less" scoped>
#SubsidiarySelect {
  :deep(.el-select) {
    width: 100%;
    .el-input {
      width: auto;
      .el-input__inner {
        border: none !important;
        width: auto;
        font-weight: 550;
        font-size: 14px;
      }
    }
  }
}
</style>